
const techIndex = {
    indexBanner: null,
    getIndexInfo: function () {
        let _this = this;
        ajax_get(host + '/ajax/index',
            true,
            {},
            (res) => {
                res = JSON.parse(res)
                if (res.background) {
                    // Object.keys(res.background).forEach(item => {
                    //     res.background[item] = decodeURI(res.background[item]) 
                    // })
                    console.log(res)
                    const { advantage, background, partner, products, project, solution } = res;
                    let section1Url = `url(${background.background_1}) no-repeat center`;
                    let section4Url = `url(${background.background_2}) no-repeat top`;
                    $(".section2").css("background", section1Url).css("background-size", "cover")
                    $(".section4").css("background", section4Url)
                    _this.renderHtml(".advantage-container", advantage, 'advantage')
                    _this.renderHtml(".pro-container", products, 'products')
                    _this.renderHtml(".case-container", project, 'project')
                    _this.renderHtml(".section-part-box", partner, 'partner')
                    _this.renderHtml(".solution-container", solution, 'solution')
                }
            },
            err => {
                console.log(err)
            }
        );
    },
    renderHtml: function (selector, data, tag) {
        if (tag == 'advantage') {
            let str = ''
            if (data && data.length > 0)
                data.forEach((item, index) => {
                    str += ` <div class="section-advantage wow fadeInUp d2">
                <div class="advantage-img">
                    <img src="${item.logo}" alt="">
                </div>
                <div class="advantage-title">
                   ${item.title}
                </div>
                <div class="line"></div>
                <div class="advantage-desc">
                    ${item.text}
                </div>
                <div class="advantage-index">
                    0${index + 1}
                </div>
            </div>`
                });
            $(selector).html(str)
        } else if (tag == 'products') {
            let str = ''
            if (data && data.length > 0)
                data.forEach(item => {
                    str += `<div class="pro-box wow fadeInUp d2">
                <a href="product-detail.html?id=${item.id}">
                <div class="pro-img">
                    <img src="${item.image}" alt="">
                </div>
                <div class="pro-bot">
                    <span>${item.title}</span>
                    <em>></em>
                </div>
                </a>
            </div>`
                })
            $(selector).html(str)
        } else if (tag == 'project') {
            let caseStr = ""
            if(data && data.length > 0){
                data.forEach((item, index) => {
                    caseStr += `<li>
                    <a href="case-detail.html?id=${item.id}">${item.title}</a>
                    </li>`
                })
                // $(".foot-cases-ul").html(caseStr)
            }
            let str = ''
            if (data && data.length > 0)
                data.forEach(item => {
                    str += ` <div class="swiper-slide">
                <div class="case-box">
                    <img src="${item.image}" alt="">
                    <div class="case-title">
                        ${item.title}
                    </div>
                </div>
            </div>`
                })
            $(selector).html(str)
        } else if (tag == 'partner') {
            let str = ''
            if (data && data.length > 0)
                data.forEach(item => {
                    str += ` <div class="swiper-slide">
                <div class="section-part ">
                    <img src="${item.image}" alt="">
                </div>
            </div>`
                })

            $(selector).html(str)
        } else if (tag == 'solution') {
            let footStr = ''
            if (data && data.length > 0) {
                data.forEach((item, index) => {
                    footStr += `<li>
                    <a href="solution-detail.html?id=${item.id}">${item.title}</a>
                    </li>`
                })
            }
            $(".foot-solution-ul").html(footStr)

            let str = ''
            str += `<div class="solution-top wow fadeInUp d2">`
            if (data && data.length > 0)
                data.forEach((item, index) => {
                    if (index <= 2) {
                        str += `<div class="solution-case">
                    <a href="solution-detail.html?id=${item.id}">
                    <img src="${item.index_background}" alt="">
                    <span>${item.title}</span>
                    </a>
                </div>`
                    }
                })
            str += `</div>`
            str += `<div class="solution-bot wow fadeInUp d2">`
            data.forEach((item, index) => {
                if (index > 2) {
                    str += `<div class="solution-case">
                <img src="${item.index_background}" alt="">
                <span>${item.title}</span>
            </div>`
                }
            })
            str += `</div>`
            $(selector).html(str)
        }
    },
    getIndexBanner: function () {
        ajax_get(host + '/ajax/banner/index',
            true,
            {},
            (res) => {
                res = JSON.parse(res)

            },
            err => {
                console.log(err)
            }
        );
    }

}

$(function () {
    techIndex.getIndexInfo()
    common.init()
    common.caseTab()
    common.partTab()
    common.getBanner('index')
    common.getConfigInfo()
    common.getPhoneInfo()
    common.getFootProductCatList()
    // common.indexSwiper()

    // techIndex.getIndexBanner()
    // common.caseHover()
})